<template>
  <div class="folded-panel">
    <el-table :data="formatData" :row-style="showRow" :cell-style="cellstyle" class="folded-panel-con">
      <el-table-column v-for="(column, index) in columns" :key="column.value">
        <template slot-scope="scope">
          <span v-if="iconShow(index,scope.row)" class="tree-ctrl" @click="toggleExpanded(scope.$index)">
            <i v-if="!scope.row._expanded" class="el-icon-circle-plus"/>
            <i v-else class="el-icon-remove"/>
          </span>
          <span v-if="column.value == 'name'">
            <span v-if="scope.row.category == 3" class="svg-container" >
              <svg-icon v-if="scope.row.videoType == 0" icon-class="video"/>
              <svg-icon v-if="scope.row.videoType == 1" icon-class="audio"/>
              <svg-icon v-if="scope.row.videoType == 2" icon-class="pdf"/>
              <svg-icon v-if="scope.row.type == 2" icon-class="course-rush"/>
              <svg-icon v-if="scope.row.type == 3" icon-class="course-exam"/>
            </span>
            {{ scope.row[column.value] || scope.row.chapterName }}
          </span>
         
            <span>
              <el-button size="mini" type="primary" @click="handleAddLessons(scope.row)">新增课节</el-button>
              <el-button size="mini" type="primary" @click="handleAddCourseware(scope.row)">添加课件</el-button>
              <el-button size="mini" type="primary" @click="handleAddRush(scope.row)">添加闯关</el-button>
              <el-button size="mini" type="primary" @click="handleAddExam(scope.row)">添加考试</el-button>
            </span>
         
        </template>
      </el-table-column>
      <slot/>
    </el-table>
    <el-dialog :title="sectionTextMap[sectionDialogStatus]" :visible.sync="sectionDialogVisible" center width="450px" top="30vh">
      <el-form ref="sectionform" :rules="sectionrules" :model="sectionform" label-position="right" label-width="70px">
        <el-form-item label="标题" prop="name">
          <el-input v-model="sectionform.name" maxlength="30" placeholder="请输入本节目录标题"/>
        </el-form-item>
        <el-form-item label="排序" prop="sort">
          <el-input v-model="sectionform.sort" maxlength="5" placeholder=""/>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button style="padding: 8px 30px;" @click="sectionDialogVisible = false">取  消</el-button>
        <el-button style="padding: 8px 30px;" type="primary" @click="sectionDialogStatus==='create'?addLessons('sectionform'):updateLessons('sectionform')">确  定</el-button>
      </div>
    </el-dialog>
    <el-dialog :title="cwTextMap[cwDialogStatus]" :visible.sync="cwDialogVisible" center width="450px" top="30vh">
      <el-form ref="cwform" :rules="cwrules" :model="cwform" label-position="right" label-width="80px">
        <el-form-item label="课件标题" prop="title">
          <el-input v-model="cwform.title" placeholder="请输入课件标题"/>
        </el-form-item>
        <el-form-item label="设置课件" prop="videoId">
          <div v-if="cwobj" class="select-data">{{ cwobj.name }}<i class="el-icon-close" @click="removeCw"/></div>
          <div v-else class="selectbtn" @click="handleSelCw">选择课件</div>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button style="padding: 8px 30px;" @click="cwDialogVisible = false">取  消</el-button>
        <el-button style="padding: 8px 30px;" type="primary" @click="cwDialogStatus==='create'?createCwData():updateCwData()">确  定</el-button>
      </div>
    </el-dialog>
    <el-dialog :title="gateTextMap[gateDialogStatus]" :visible.sync="gateDialogVisible" :fullscreen="true" center width="800px" top="10vh">
      <rush ref="rush" :gateform="gateform"/>
      <div slot="footer" class="dialog-footer">
        <el-button style="padding: 8px 30px;" @click="gateDialogVisible = false">取  消</el-button>
        <el-button style="padding: 8px 30px;" type="primary" @click="gateDialogStatus==='create'?createGateData():updateGateData()">确  定</el-button>
      </div>
    </el-dialog>
    <el-dialog :visible.sync="examDialogVisible" title="选择考试" class="exam-dialog" center width="1000px" top="10vh">
      <exam ref="exam" :e-obj="examobj" :e-id="examId"/>
      <div slot="footer" class="dialog-footer">
        <el-button style="padding: 8px 30px;" @click="examDialogVisible = false">取  消</el-button>
        <el-button style="padding: 8px 30px;" type="primary" @click="examDialogStatus==='create'?createExamData():updateExamData()">确  定</el-button>
      </div>
    </el-dialog>
    <el-dialog :visible.sync="courseWareDialogVisible" title="课件资源" center width="900px" top="10vh">
      <course-ware ref="courseware"/>
      <div slot="footer" class="dialog-footer">
        <el-button style="padding: 8px 30px;" @click="courseWareDialogVisible = false">{{ $t('table.cancel') }}</el-button>
        <el-button style="padding: 8px 30px;" type="primary" @click="subCw">{{ $t('table.confirm') }}</el-button>
      </div>
    </el-dialog>
    <el-dialog :visible.sync="courseWareViewDialogVisible" title="课件预览" center width="900px" top="10vh">
      <view-course-ware ref="viewcourseware" :type="courseWraeType" :file-id="courseWareId"/>
      <div slot="footer" class="dialog-footer"/>
    </el-dialog>
    <el-dialog :visible.sync="rushViewDialogVisible" title="闯关试题预览" center width="900px" top="5vh">
      <view-rush ref="rush" :list="rushlist"/>
      <div slot="footer" class="dialog-footer"/>
    </el-dialog>
    <el-dialog :visible.sync="examViewDialogVisible" title="考试试题预览" center width="900px" top="5vh">
      <view-exam ref="exam" :list="examList"/>
      <div slot="footer" class="dialog-footer"/>
    </el-dialog>
  </div>
</template>
<script>
import { specialText, int } from '@/utils/validate'
import Pagination from '@/components/Pagination'
// import { sectionInsertUpdate, lesson4delete } from '@/api/course/course'
// import { insertAdminCourseVideo, updateAdminCourseVideo, deleteAdminCourseVideo, preInsertAdminCourseVideo } from '@/api/course/create'
// import { insertAdminCourseRush, updateAdminCourseRush, deleteAdminCourseRush, preInsertAdminCourseRush, queryAdminCourseRush, queryQuesRepoList, queryQuesListByIds, queryQuesByRepoIds } from '@/api/course/rush'
// import { insertAdminCourseExam, updateAdminCourseExam, deleteAdminCourseExam, preInsertAdminCourseExam, queryAdminCourseExam } from '@/api/course/exam'
import treeToArray from './eval'
import exam from './components/exam'
import rush from './components/rush/index'
import courseWare from './components/courseWare'
import ViewCourseWare from './components/view/courseware'
import ViewRush from './components/view/rush'
import ViewExam from './components/view/exam'
export default {
  name: 'FoldedPanel',
  components: { Pagination, exam, rush, courseWare, ViewCourseWare, ViewRush, ViewExam },
  props: {
    /* eslint-disable */
    data: {
      type: [Array, Object],
      required: true
    },
    columns: {
      type: Array,
      default: () => []
    },
    evalFunc: Function,
    evalArgs: Array,
    expandAll: {
      type: Boolean,
      default: true
    },
    theEditor: {
      type: Boolean,
      default: true
    }
  },
  data() {
    return {
      cwobj: null,
      cwtreeloading: false,
      cwclickTree: [],
      cwClassifyId: '-1',
      cwfilterText: '',
      courseWareDialogVisible: false,
      cwtreedata: [],
      cwdefaultProps: {
        children: 'children',
        label: 'question'
      },
      sectionform: {
        id: '',
        name :'',
        courseId: '',
        parentId: '',
        remark: '',
        sort: '',
        type: '1'
      },
      sectionDialogVisible: false,
      sectionDialogStatus: '',
      sectionTextMap: {
        update: '编辑课节',
        create: '新建课节'
      },
      sectionrules: {
        name: [
          { required: true, message: '请输入本节目录标题', trigger: 'change' },
          { validator: specialText, trigger: 'blur' },
          { min: 1, max: 50, message: '目录标题过长', trigger: 'blur' }
        ],
        sort: [
          { required: true, message: '请输入本节目录排序', trigger: 'change' },
          { validator: int, trigger: 'blur' },
          { min: 1, max: 3, message: '目录排序过长', trigger: 'blur' }
        ]

      },
      cwform: {
        title :'',
        courseId: '',
        lessonId: '',
        videoId: ''
      },
      cwDialogVisible: false,
      cwDialogStatus: '',
      cwTextMap: {
        update: '编辑课件',
        create: '添加课件'
      },
      cwrules: {
        title: [
          { required: true, message: '请输入课件标题', trigger: 'change' },
          { validator: specialText, trigger: 'blur' }
          ],
        videoId: [{ required: true, message: '请选择课件', trigger: 'change' }]
      },
      gateform: {
        name :'',
        limitTime: '',
        scoreWeight: '',
        answerWrongMark: '',
        quesNums: '',
        gateContitionRequest: 0,
        passContitionType: 0,
        passContitionValue: '',
        makeQuesWay: 1,
        courseId: '',
        lessonId: '',
        classifyIds: '',
        quesIds: '',
        isHavePrize: 0,
        prizeId: '',
        prizeType: 0
      },
      gateDialogVisible: false,
      gateDialogStatus: '',
      gateTextMap: {
        update: '编辑闯关',
        create: '添加闯关'
      },
      examDialogVisible: false,
      examDialogStatus: '',
      examForm: {
        courseId: '',
        lessonId: '',
        examId: '',
        title: ''
      },
      examobj: null,
      examId: '',
      courseWareViewDialogVisible: false,
      courseWraeType: '',
      courseWareId: '',
      rushlist: [],
      rushViewDialogVisible: false,
      examViewDialogVisible: false,
      examList: [],
      visible:false
    }
  },
  computed: {
    // 格式化数据源
    formatData: function() {
      let tmp
      if (!Array.isArray(this.data)) {
        tmp = [this.data]
      } else {
        tmp = this.data
      }
      const func = this.evalFunc || treeToArray
      const args = this.evalArgs ? Array.concat([tmp, this.expandAll], this.evalArgs) : [tmp, this.expandAll]
      return func.apply(null, args)
    },
    canprve() {
      if (this.examListQuery.page === 1) {
        return false
      } else {
        return true
      }
    },
    cannext() {
      if (this.examListQuery.page < this.pageCount) {
        return true
      } else {
        return false
      }
    }
  },
  methods: {
    // 课节相关
    handleAddLessons(row) {
      this.resetSectionform(row)
      this.sectionDialogStatus = 'create'
      this.sectionDialogVisible = true
      this.$nextTick(() => {
        this.$refs['sectionform'].clearValidate()
      })
    },
    handleEditLessons(row) {
      this.sectionDialogStatus = 'update'
      this.sectionDialogVisible = true
      this.sectionform = {
        id: row.id,
        name: row.name,
        courseId: row.courseId,
        parentId: row.parentId,
        remark: '',
        sort: row.sort,
        type: '1'
      }
    },
    handleDeleteLessons(row) {
      this.deleteLessons(row.id)
    },
    resetSectionform(row) {
      this.sectionform = {
        id: '',
        name :'',
        courseId: row.courseId,
        parentId: row.id,
        remark: '',
        sort: '',
        type: '1'
      }
    },
    addLessons(formName){
      this.$refs[formName].validate((valid) => {
        if (valid) {
          const loading = this.$loading({
            lock: true,
            text: '请稍后',
            spinner: 'el-icon-loading',
            background: 'rgba(0, 0, 0, 0.1)'
          })
          return new Promise((resolve, reject) => {
            sectionInsertUpdate(this.sectionform).then(() => {
              this.sectionDialogVisible = false
              this.$notify({
                title: '成功',
                message: '创建成功',
                type: 'success',
                duration: 2000
              })
              loading.close()
              this.refresh()
            }).catch(error => {
              loading.close()
              reject(error)
            })
          })
        }
      })
    },
    updateLessons(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          const loading = this.$loading({
            lock: true,
            text: '请稍后',
            spinner: 'el-icon-loading',
            background: 'rgba(0, 0, 0, 0.1)'
          })
          return new Promise((resolve, reject) => {
            sectionInsertUpdate(this.sectionform).then(() => {
              this.sectionDialogVisible = false
              this.$notify({
                title: '成功',
                message: '修改成功',
                type: 'success',
                duration: 2000
              })
              loading.close()
              this.refresh()
            }).catch(error => {
              loading.close()
              reject(error)
            })
          })
        }
      })
    },
    deleteLessons(id) {
      this.$confirm('此操作将永久删除该数据, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        return new Promise((resolve, reject) => {
          lesson4delete(id).then(response => {
            this.$notify({
              title: '成功',
              message: '删除成功',
              type: 'success',
              duration: 2000
            })
            this.refresh()
          }).catch(error => {
            reject(error)
          })
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        })
      })
    },
    // 课件相关
    handleAddCourseware(row) {
    this.preAddCourseware(row)
    },
    handleEditCourseware(row) {
      this.cwform = {
        id: row.id,
        title: row.title,
        videoId: ''
      }
      this.cwobj = null
      this.cwDialogStatus = 'update'
      this.cwDialogVisible = true
    },
    handleDeleteCourseware(row) {
      this.deleteCourseware(row.id)
    },
    resetCwform(row) {
      this.cwform = {
        title :'',
        courseId: row.courseId,
        lessonId: row.id,
        videoId: ''
      }
      this.cwobj = null
    },
    preAddCourseware(row) {
      return new Promise((resolve, reject) => {
        preInsertAdminCourseVideo(row.courseId, row.id).then(() => {
          this.resetCwform(row)
          this.cwDialogStatus = 'create'
          this.cwDialogVisible = true
          this.$nextTick(() => {
            this.$refs['cwform'].clearValidate()
          })
        }).catch(error => {
          reject(error)
        })
      })
    },
    deleteCourseware(id) {
      this.$confirm('此操作将永久删除该数据, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        return new Promise((resolve, reject) => {
          deleteAdminCourseVideo(id).then(response => {
            this.$notify({
              title: '成功',
              message: '删除成功',
              type: 'success',
              duration: 2000
            })
            this.refresh()
          }).catch(error => {
            reject(error)
          })
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        })
      })

    },
    handleSelCw() {
      this.courseWareDialogVisible = true
    },
    removeCw() {
      this.cwobj = null
      this.cwform.videoId = ''
    },
    subCw() {
      this.cwobj = this.$refs.courseware.selectData
      if (this.cwobj) {
        this.cwform.videoId = this.cwobj.id
        this.cwform.title = this.cwobj.name
        this.courseWareDialogVisible = false
      } else {
        this.$message({
          showClose: true,
          message: '请选择课件',
          type: 'warning'
        })
      }
    },
    createCwData() {
      this.$refs['cwform'].validate((valid) => {
        if (valid) {
          const loading = this.$loading({
            lock: true,
            text: '请稍后',
            spinner: 'el-icon-loading',
            background: 'rgba(0, 0, 0, 0.1)'
          })
          return new Promise((resolve, reject) => {
            insertAdminCourseVideo(this.cwform).then(() => {
              this.cwDialogVisible = false
              this.$notify({
                title: '成功',
                message: '创建成功',
                type: 'success',
                duration: 2000
              })
              loading.close()
              this.refresh()
            }).catch(error => {
              loading.close()
              reject(error)
            })
          })
        }
      })
    },
    updateCwData() {
      this.$refs['cwform'].validate((valid) => {
        if (valid) {
          const loading = this.$loading({
            lock: true,
            text: '请稍后',
            spinner: 'el-icon-loading',
            background: 'rgba(0, 0, 0, 0.1)'
          })
          return new Promise((resolve, reject) => {
            updateAdminCourseVideo(this.cwform).then(() => {
              this.cwDialogVisible = false
              this.$notify({
                title: '成功',
                message: '修改成功',
                type: 'success',
                duration: 2000
              })
              loading.close()
              this.refresh()
            }).catch(error => {
              loading.close()
              reject(error)
            })
          })
        }
      })
    },
    resetGateform(row) {
      this.gateform = {
        name :'',
        limitTime: '',
        scoreWeight: '',
        answerWrongMark: '',
        quesNums: '',
        gateContitionRequest: 0,
        passContitionType: 0,
        passContitionValue: '',
        makeQuesWay: 1,
        courseId: row.courseId,
        lessonId: row.id,
        classifyIds: '',
        quesIds: '',
        isHavePrize: 0,
        prizeId: '',
        prizeType: 0
      }
    },
    handleAddRush(row) {
      this.preAddRush(row)
    },
    handleEditRush(row) {
      console.log(row)
      this.getRushInfo(row)
    },
    handleDeleteRush(row) {
      this.deleteRush(row)
    },
    getRushQuesBankInfo(ids) {
      const that = this
      return new Promise((resolve, reject) => {
        queryQuesRepoList('', ids).then((res) => {
          that.$refs.rush.setQuesBank(res.data.data)
        }).catch(error => {
          reject(error)
        })
      })
    },
    getRushQuesInfo(ids) {
      const that = this
      return new Promise((resolve, reject) => {
        queryQuesListByIds(ids).then((res) => {
          that.$refs.rush.setQuesList(res.data.data)
        }).catch(error => {
          reject(error)
        })
      })
    },
    getRushInfo(row) {
      const loading = this.$loading({
        lock: true,
        text: '请稍后',
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.1)'
      })
      return new Promise((resolve, reject) => {
        queryAdminCourseRush(row.id, row.sequenceId).then((res) => {
          loading.close()
          this.gateform = {
            id: res.data.data.id,
            name: res.data.data.name,
            limitTime: res.data.data.limitTime,
            scoreWeight: res.data.data.scoreWeight,
            answerWrongMark: res.data.data.answerWrongMark,
            quesNums: res.data.data.quesNums,
            gateContitionRequest: res.data.data.gateContitionRequest,
            passContitionType: res.data.data.passContitionType,
            passContitionValue: res.data.data.passContitionValue,
            linksId: row.id,
            makeQuesWay: res.data.data.makeQuesWay,
            courseId: row.courseId,
            lessonId: row.lessonId || '',
            classifyIds: res.data.data.classifyIds || '',
            quesIds: res.data.data.quesIds || '',
            isHavePrize: res.data.data.isHavePrize,
            prizeId: res.data.data.prizeId || '',
            prizeType: res.data.data.prizeType,

          }
          this.gateDialogStatus = 'update'
          this.gateDialogVisible = true
          if (this.gateform.makeQuesWay === 1) {
            this.getRushQuesBankInfo(this.gateform.classifyIds)
          } else {
            this.getRushQuesInfo(this.gateform.quesIds)
          }
        }).catch(error => {
          loading.close()
          reject(error)
        })
      })
    },
    preAddRush(row) {
      const that = this
      return new Promise((resolve, reject) => {
        preInsertAdminCourseRush(row.courseId, row.id).then(() => {
          this.resetGateform(row)
          this.gateDialogStatus = 'create'
          this.gateDialogVisible = true
          that.$refs.rush.setQuesBank([])
          that.$refs.rush.setQuesList([])
        }).catch(error => {
          reject(error)
        })
      })
    },
    createGateData() {
      this.$refs.rush.$refs['gateform'].validate((valid) => {
        if (valid) {
          const loading = this.$loading({
            lock: true,
            text: '请稍后',
            spinner: 'el-icon-loading',
            background: 'rgba(0, 0, 0, 0.1)'
          })
          return new Promise((resolve, reject) => {
            insertAdminCourseRush(this.gateform).then(() => {
              this.gateDialogVisible = false
              this.$notify({
                title: '成功',
                message: '创建成功',
                type: 'success',
                duration: 2000
              })
              loading.close()
              this.refresh()
            }).catch(error => {
              loading.close()
              reject(error)
            })
          })
        }
      })
    },
    updateGateData() {
      this.$refs.rush.$refs['gateform'].validate((valid) => {
        if (valid) {
          const loading = this.$loading({
            lock: true,
            text: '请稍后',
            spinner: 'el-icon-loading',
            background: 'rgba(0, 0, 0, 0.1)'
          })
          return new Promise((resolve, reject) => {
            updateAdminCourseRush(this.gateform).then(() => {
              this.gateDialogVisible = false
              this.$notify({
                title: '成功',
                message: '编辑成功',
                type: 'success',
                duration: 2000
              })
              loading.close()
              this.refresh()
            }).catch(error => {
              loading.close()
              reject(error)
            })
          })
        }
      })
    },
    deleteRush(row) {
      this.$confirm('此操作将永久删除该数据, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        return new Promise((resolve, reject) => {
          deleteAdminCourseRush(row.id, row.sequenceId).then(response => {
            this.$notify({
              title: '成功',
              message: '删除成功',
              type: 'success',
              duration: 2000
            })
            this.refresh()
          }).catch(error => {
            reject(error)
          })
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        })
      })
    },
    // 考试相关
    resetExamform(row) {
      this.examForm = {
        courseId: row.courseId,
        lessonId: row.id,
        examId: '',
        title: ''
      }
    },
    handleAddExam(row) {
      this.examId = ''
      this.examObj = null
      this.preAddExam(row)
    },
    handleEditExam(row) {
      console.log(row)
      this.examObj = {
        id: row.examId,
        name: row.title
      }
      this.examId = row.examId
      this.examForm = {
        id: row.id,
        courseId: row.courseId,
        lessonId: row.lessonId,
        examId: '',
        title: row.title
      }
      this.examDialogStatus = 'update'
      this.examDialogVisible = true
    },
    handleDeleteExam(row) {
      this.deleteExam(row)
    },
    preAddExam(row) {
      return new Promise((resolve, reject) => {
        preInsertAdminCourseExam(row.courseId, row.id).then(() => {
          this.resetExamform(row)
          this.examDialogStatus = 'create'
          this.examDialogVisible = true
        }).catch(error => {
          reject(error)
        })
      })
    },
    createExamData() {
      const obj = this.$refs.exam.examobj
      this.examForm.examId = obj.id
      this.examForm.title = obj.name
      const loading = this.$loading({
        lock: true,
        text: '请稍后',
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.1)'
      })
      return new Promise((resolve, reject) => {
        insertAdminCourseExam(this.examForm).then(() => {
          this.examDialogVisible = false
          this.$notify({
            title: '成功',
            message: '创建成功',
            type: 'success',
            duration: 2000
          })
          loading.close()
          this.refresh()
        }).catch(error => {
          loading.close()
          reject(error)
        })
      })
    },
    updateExamData() {
      console.log(this.$refs.exam.examobj)
      const obj = this.$refs.exam.examobj
      this.examForm.examId = obj.id
      this.examForm.title = obj.name
      const loading = this.$loading({
        lock: true,
        text: '请稍后',
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.1)'
      })
      return new Promise((resolve, reject) => {
        updateAdminCourseExam(this.examForm).then(() => {
          this.examDialogVisible = false
          this.$notify({
            title: '成功',
            message: '修改成功',
            type: 'success',
            duration: 2000
          })
          loading.close()
          this.refresh()
        }).catch(error => {
          loading.close()
          reject(error)
        })
      })
    },
    deleteExam(row) {
      this.$confirm('此操作将永久删除该数据, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        return new Promise((resolve, reject) => {
          deleteAdminCourseExam(row.id).then(response => {
            this.$notify({
              title: '成功',
              message: '删除成功',
              type: 'success',
              duration: 2000
            })
            this.refresh()
          }).catch(error => {
            reject(error)
          })
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        })
      })

    },
    getViewRushQues(row) {
      const loading = this.$loading({
        lock: true,
        text: '请稍后',
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.1)'
      })
      return new Promise((resolve, reject) => {
        queryAdminCourseRush(row.id, row.sequenceId).then((res) => {
          return new Promise((resolve, reject) => {
            if (res.data.data.makeQuesWay === 1) {
              queryQuesByRepoIds(res.data.data.classifyIds, res.data.data.quesNums).then((res) => {
                loading.close()
                this.rushlist = res.data.data
                this.rushViewDialogVisible = true
              }).catch(error => {
                reject(error)
              })
            } else {
              queryQuesListByIds(res.data.data.quesIds).then((res) => {
                loading.close()
                this.rushlist = res.data.data
                this.rushViewDialogVisible = true
              }).catch(error => {
                reject(error)
              })
            }
          })
        }).catch(error => {
          loading.close()
          reject(error)
        })
      })
    },
    getViewExamQues(row) {
      const loading = this.$loading({
        lock: true,
        text: '请稍后',
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.1)'
      })
      return new Promise((resolve, reject) => {
        queryAdminCourseExam({type: "paper",examInfoId:row.examId}).then((res) => {
          loading.close()
          this.examList = res.data.data
          this.examViewDialogVisible = true
        }).catch(error => {
          loading.close()
          reject(error)
        })
      })
    },
    view(row) {
      if (row.type === 1) {
        this.courseWraeType = row.videoType
        this.courseWareId = row.fileId
        this.courseWareViewDialogVisible = true
      } else if (row.type === 2) {
        this.getViewRushQues(row)
      } else {
        this.getViewExamQues(row)
        //top.location.href = '/html/exam/view.html?id=' + row.examId
      }
    },
    refresh() {
      this.$emit('onrefresh')
    },
    showRow: function(row) {
      const show = (row.row.parent ? (row.row.parent._expanded && row.row.parent._show) : true)
      row.row._show = show
      if(show) {
        var str = ''
        if(row.row._level == 1){
          str = 'animation:treeTableShow 1s;-webkit-animation:treeTableShow 1s;'
        }else if(row.row._level == 2 ){
          str = 'animation:treeTableShow 1s;-webkit-animation:treeTableShow 1s;padding-left:60px;'
        }else{
          str = 'animation:treeTableShow 1s;-webkit-animation:treeTableShow 1s;padding-left:120px;'
        }
        return str
      } else {
        return 'display:none;'
      }
    },
    cellstyle(row) {
      var str = 'min-height: 50px;'
      if(row.row.category == 3 ){
        str = 'min-height: 50px;background-color:#F7F7F8;'
      }
      return str
    },
    // 切换下级是否展开
    toggleExpanded: function(trIndex) {
      const record = this.formatData[trIndex]
      record._expanded = !record._expanded
    },
    // 图标显示
    iconShow(index, record) {
      return (index === 0 && record.children && record.children.length > 0)
    }
  }
}
</script>
<style rel="stylesheet/css">
  @keyframes treeTableShow {
    from {opacity: 0;}
    to {opacity: 1;}
  }
  @-webkit-keyframes treeTableShow {
    from {opacity: 0;}
    to {opacity: 1;}
  }
</style>
<style lang="scss" rel="stylesheet/scss">
$mainColor: #18A5FD;

.folded-panel{
  colgroup{
    display: none;
  }
  .el-dialog__body{
    padding: 20px 20px 0px 20px;
  }
  .el-dialog__footer{
    padding: 0 10px 20px;
  }
  .exam-dialog{
    .el-dialog__body{
      padding: 20px 20px 0px 30px;
    }
  }
  .select-data{
    display: inline-block;
    background:rgba(246,246,246,1);
    border-radius:4px;
    font-size:14px;
    font-family:PingFangSC-Regular;
    font-weight:400;
    color:rgba(51,51,51,1);
    padding: 0 10px;
    margin-right: 5px;
    i{
      cursor: pointer;
      padding-left: 5px;
    }
  }
  .selectbtn{
    display: inline-block;
    width: 120px;
    background:rgba(255,255,255,1);
    border:1px dotted $mainColor;
    border-radius:4px;
    font-size:14px;
    font-family:PingFangSC-Regular;
    font-weight:400;
    color:$mainColor;
    text-align: center;
    cursor: pointer;
  }
  .table-seareh{
    text-align: center;
    border-bottom: 1px solid #E2E3E8;
    margin-bottom: 20px;
  }
  .tableScope{
    padding: 0 20px;
  }
  .item-ques{
    margin-top: 10px;
    .ques-item{
      margin-bottom: 10px;
      display: flex;
      .ques-item-info{
        padding: 10px 20px;
        background-color: #F7F7F8;
        position: relative;
        flex: 1;
      }
      .ques-item-btn{
        position: relative;
        width: 40px;
        i{
          position: absolute;
          top: 50%;
          margin-top: -8px;
          left: 50%;
          margin-left: -8px;
          cursor: pointer;
        }
      }
      .ques-item-title{
        width: 80%;
        font-size:14px;
        font-family:PingFangSC-Medium;
        font-weight:bold;
        color:rgba(51,51,51,1);
        margin: 0;
      }
      .ques-item-answer{
        margin: 0;
        padding: 0;
        margin-top: 5px;
        margin-left: 15px;
        width: 80%;
        li{
          list-style: none;
          font-size:14px;
          font-family:PingFangSC-Regular;
          font-weight:400;
          color:rgba(51,51,51,1);
          line-height: 30px;
          &.active{
            color: $mainColor;
          }
        }
      }
      .ques-item-score{
        width: 120px;
        position: absolute;
        right: 0;
        top: 50%;
        margin-top: -14px;
        font-size: 14px;
        font-family: PingFangSC-Regular;
        font-weight: 400;
        .el-input{
          margin: 0 5px;
        }
      }
    }
  }
  .btn-popover{
    margin-left: 10px;
  }
}
.classify-tree-con{
  .el-tree{
    padding: 10px 0;
  }
}
.folded-panel-con{
  &.el-table{
    &:before{
      height: 0;
    }
    table{
      display: flex;
      tbody{
        flex: 1;
      }
    }
    .el-table__header-wrapper{
      display: none;
    }
    .el-table__body{
      width: 100%;
      tr{
        width: 100%;
        margin-bottom: 10px;
        display: block;
        td{
          border-bottom: 1px solid #E2E3E8;
          border-top: 1px solid #E2E3E8;
          display: inline-block;
          .cell{
            line-height: 28px;
          }
          &:first-child{
            border-left: 1px solid #E2E3E8;
            width: 40%;
          }
          &:last-child{
            border-right: 1px solid #E2E3E8;
            text-align: right;
            width: 60%;
          }
        }
      }
    }
  }
  .panel-con-btns{
    .el-button.el-button--default{
      padding: 7px 16px;
    }
    .el-button--primary{
      background-color: #ffffff;
      color: $mainColor;
      border-color: $mainColor;
    }
  }
}
</style>
<style lang="scss" rel="stylesheet/scss" scoped>
  $color-blue: #2196F3;
  $space-width: 18px;
  .processContainer{
    width: 100%;
    height: 100%;
  }
  .tree-ctrl{
    position: relative;
    cursor: pointer;
    i{
      color: #FE5A61;
      font-size: 18px;
      vertical-align: top;
      margin-top: 4px;
    }
  }
  .courseware-btns{
    .el-button{
      background:rgba(255,255,255,1);
      border:1px solid rgba(226,227,232,1);
      font-family:PingFangSC-Medium;
      font-weight:500;
      color:rgba(102,102,102,1);
    }
    i{
      color: #FE5A61;
      font-size: 16px;
      cursor: pointer;
    }
  }
</style>
<style lang="scss" rel="stylesheet/scss" scoped>
$mainColor: #18A5FD;
.exam-con{
  min-height: 350px;
  position: relative;
  .exam-con-add{
    height: 40px;
    line-height: 40px;
    border:1px dotted $mainColor;
    border-radius:4px;
    font-size:14px;
    font-family:PingFangSC-Regular;
    font-weight:400;
    color:$mainColor;
    text-align: center;
    cursor: pointer;
    display: inline-block;
    width: 200px;
    margin-bottom: 10px;
    &:hover{
      border:1px dotted #FE5A61;
    }
  }
  .exam-con-page{
    position: absolute;
    top: 50%;
    margin-top: -40px;
    padding: 20px 5px;
    background-color: #E5E5E5;
    color: #ffffff;
    font-size: 16px;
    cursor: pointer;
    &.prve{
      left: -30px;
    }
    &.next{
      right: -19px;
    }
    &.active{
      background-color: #FE5A61;
    }
  }
  .exam-list-item{
    background-color: #ffffff;
    padding: 10px;
    margin-right: 10px;
    margin-bottom: 10px;
    box-shadow: 0 0 10px #f2f2f2;
    border-radius:4px;
    position: relative;
    cursor: pointer;
    &.create{
      p{
        text-align: center;
        font-size: 16px;
      }
    }
    &.active{
      box-shadow: 0 2px 10px #ecf8ff;
    }
    &.active:before{
      content: '';
      width: 3px;
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      background-color: $mainColor;
      border-top-left-radius: 4px;
      border-bottom-left-radius: 4px;
    }
    .item-select-img{
      position: absolute;
      top: 0;
      right: 0;
    }
    p{
      margin: 5px 0;
      line-height: 1.5;
      font-family:PingFangSC-Regular;
      font-size: 12px;
    }
    .item-title{
      margin-bottom: 10px;
      .el-checkbox{
        font-size: 14px;
        color: #333333;
        .el-checkbox__input.is-checked .el-checkbox__inner, .el-checkbox__input.is-indeterminate .el-checkbox__inner{
          background-color: #FE5A61;
          border-color: #FE5A61;
        }
        .el-checkbox__input.is-checked+.el-checkbox__label{
          color: #FE5A61;
        }
      }
    }
    .item-crtUser, .item-crtime{
      font-size:12px;
      font-family:PingFangSC-Regular;
      font-weight:400;
      color:rgba(166,166,166,1);
    }
    .item-titme{
      color: #666666;
      span{
        color: #FE5A61;
      }
    }
    .item-score{
      color: #666666;
    }
    .item-btns{
      display: flex;
      margin-top: 10px;
      position: relative;
      .el-button{
        color: rgb(253, 124, 59);
        font-family: PingFangSC-Medium;
        font-weight: 500;
        flex: 1;
        span{
          font-size: 14px;
          font-weight:500;
        }
      }
      &:before{
        content: "";
        position: absolute;
        top: 0;
        left: -10px;
        right: -10px;
        height: 1px;
        background-color: #E2E3E8;
      }
    }
  }
  .item-btn{
    position: absolute;
    padding: 5px 20px;
    top: 10px;
    right: 10px;
    color: #ffffff;
    background: rgba(254,90,97,1);
    border-radius: 24px;
    font-size: 12px;
  }
}
</style>

